<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link th:href="@{/css/bootstrap.css}" rel="stylesheet">
    <style>

        body {
            font-family: Arial, sans-serif;
            background-color: #f8f9fa;
            margin: 0;
            padding: 0;
            background-image: url("https://www.bing.com/th?id=OHR.Everglades90th_ZH-CN9853372570_1920x1080.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-attachment: fixed;
        }

        .container {
            margin-top: 100px;
        }

        .login-box {
            background-color: #fff;
            padding: 20px;
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }
    </style>
</head>
<body>

<div class="container">
    <div class="row justify-content-md-center">
        <div class="col-md-4 login-box">
            <h4 class="text-center">登录购物商城</h4>
            <form th:action="@{/user/login}" method="post">
                <div class="form-group">
                    <label>用户名:</label>
                    <input type="text" class="form-control" name="user_id" th:required="true">
                </div>
                <div class="form-group">
                    <label>密码:</label>
                    <input type="password" class="form-control" name="userpwd" th:required="true">
                </div>
                <div class="form-group">
                    <input type="submit" value="登录" class="btn btn-primary btn-block">
                </div>
                <span th:if="${err}" class="text-danger" th:text="${err}"></span>
            </form>
        </div>
    </div>

    <div class="row mt-3 justify-content-md-center">
        <div class="col-md-4 text-center">
            <a th:href="@{/allManageProduct}" th:target="_self">后台管理</a>
        </div>
    </div>
</div>

</body>